<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>光标的基本使用(basic use of cursor)</title>
  <!-- 
    CSS中cursor属性用于定义鼠标指针悬停在元素上时的样式。
    cursor属性值及其对应的文字说明： 
 
      1. auto：浏览器自动选择适当的光标。 
      2. pointer：小手指，表示链接。 
      3. default：默认光标，通常是一个箭头。 
      4. help：帮助光标，通常是一个问号。 
      5. text：文本光标，表示可以输入文本。 
      6. move：移动光标，表示可移动。 
      7. not-allowed：禁止光标，表示不可用。
      8. none：隐藏光标，不显示光标。
   -->
   <style>
     .cursor-auto{
       cursor: auto;
     }
     .cursor-pointer{
       cursor: pointer;
     }
     .cursor-default{
       cursor: default;
     }
     .cursor-help{
       cursor: help;
     }
     .cursor-text{
       cursor: text;
     }
     .cursor-move{
       cursor: move;
     }
     .cursor-not{
       cursor: not-allowed;
     }
     .cursor-none{
       cursor: none;
     }  
   </style>
</head>
<body>

  <div class="cursor-auto">cursor-auto</div>
  <br/>
  <div class="cursor-pointer">cursor-pointer</div>
  <br/>
  <div class="cursor-default">cursor-default</div>
  <br/>
  <div class="cursor-help">cursor-help</div>
  <br/>
  <div class="cursor-text">cursor-text</div>
  <br/>
  <div class="cursor-move">cursor-move</div>
  <br/>
  <div class="cursor-not">cursor-not</div>
  <br/>
  <div class="cursor-none">cursor-none</div>
  
</body>
</html>